<template>
	<view class="content" :style="{background: 'url('+ bgurl +'/policy/logo_bg.png)  no-repeat center fixed'}">
		<!-- <image class="login_bg" src="@/static/logo_bg.png" ></image> -->
		<view class="login_con">
			<!-- #ifdef MP-WEIXIN -->
			<view class="wid" :style="{height: `${statusBarHeight}px`}"></view> 
			<view class="navbar"  :style="{height: `${titleBarHeight}px`}">
				<view class="left"  :style="{lineHeight: `${titleBarHeight}px` }" @click="goBack">
					<uv-icon name="arrow-left" color="#fff" size="24"></uv-icon> 
				</view> 
			</view>
			<!-- #endif --> 
			<!-- #ifdef H5 -->
			<view class="navbar"  :style="{height: `${titleBarHeight}px`}"></view>  
			<!-- #endif --> 
			<image class="logo" src="@/static/logo2.png" mode="widthFix" lazy-load></image>
			<!-- #ifdef MP-WEIXIN -->
			<button v-if="selfChecked" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="loginbtn">一键登录</button> 
			<button v-else class="loginbtn" @click="getPhone">一键登录</button> 
			<button class="loginbtn lbtn" @click="escLogin">取消登录</button>
			<!-- #endif --> 
			
			<!-- #ifdef H5 -->
			 <button  @click="wechatLogin" class="loginbtn fx-row-c-c">
			 	<image class="wx_icon" src="@/static/picture/weixin1.png" mode="widthFix" lazy-load></image>
			 	<span>微信登录（注册）</span>
			 </button>  
			<!-- #endif --> 
			<view class="tips" @click="checkboxChange">
				<uv-icon v-if="!selfChecked" name="checkmark-circle" color="#8B8E8C" size="14"></uv-icon>
				<uv-icon  v-else name="checkmark-circle-fill" color="#FEBF00" size="14"></uv-icon>
				<view class="ml10">我已阅读并同意</view> 
				<view class="pro" @tap="userxy">《用户协议》</view> 
				<view class="pro" @tap="privacy">《隐私协议》</view>
			</view> 
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<view class="other_login">
			<view class="other_tit fx-row-sa-c">
				<uv-line length='32%'></uv-line>
				<view style="width: 200rpx;text-align: center;">其他登录方式</view>
				<uv-line length='32%'></uv-line>
			</view>
			<view class="fx-col-c-c" @click="gophone">
				<view class="tel_icon">
					<image src="@/static/picture/phone.png" mode="widthFix" lazy-load></image>
				</view>
				<view>手机号登录</view>
			</view>
		</view>
		<!-- #endif --> 
	</view>
</template>

<script>
	import { wxUrls,wechatLogin } from '@/utils/api.js'
	import request from '@/utils/request.js'
	import { toast } from '@/uni_modules/uv-ui-tools/libs/function/index.js'
	import {  mapActions } from 'vuex'
	import badgeMix from '@/common/mixins.js'
	import config from '@/config.js'
	export default {
		mixins: [badgeMix],
		data() {
			return {
				titleBarHeight:this.titleBarHeight,
				statusBarHeight:this.statusBarHeight,
				allBarHeight:this.allBarHeight, 
				tips2:'',
				selfChecked: false,
				tel:'',
				code:'',
				bgurl:config.imageUrl,
				beforePage1:{}
			}
		},
		//监听页面返回
		onUnload() { 
			// #ifdef H5
			// this.beforePage1.orderPayBack();
			// #endif
			// #ifndef H5
			// this.beforePage1.$vm.orderPayBack();
			// #endif
			 //需要修改的上一个界面的信息，可以在此处进行更改 
		}, 
		onShow() {  
		},
		async onLoad() {   
			// #ifdef H5
			await this.wechatRedirect() 
			// #endif
			let pages1 = getCurrentPages(); // 当前页面
			this.beforePage1 = pages1[pages1.length - 2]; // 上一页  
			// await this.menuButton() 
		},
		methods: {  
			...mapActions(['PhoneLogin','getOpenId','openId','weixinMiniLogin']),    
			checkboxChange(e){
				this.selfChecked = !this.selfChecked
			},
			codeChange2(text) { 
				this.tips2 = text; 
			}, 
			// 小程序获取手机号登录
			async getPhoneNumber(e) {
				if(!this.selfChecked){
					return toast('请先同意隐私协议！');
				}
				
				const res = await uni.login()
				console.log(e,res.code,"手机号登录"); 
				// code = res.code
				//获取手机号
				await this.weixinMiniLogin({   
					"code": res.code,
					"phoneCode": e.detail.code,
					// "encryptedData": e.detail.encryptedData,
					// "iv": e.detail.iv
				},res.code) 
			},
			getPhone(){
				if(!this.selfChecked){
					return toast('请先同意隐私协议！');
				}
			},
			getUrlCode1(name){
			    let reg = ((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)')).exec(location.href) || [, ''])[1].replace(/\+/g, '%20')
			    console.log(decodeURIComponent(reg),"getUrlCode1");
					return decodeURIComponent(reg) || null
			} ,
			//公众号授权登录
			async wechatLogin(){
					console.log("授权");
				if(!this.selfChecked){
					return toast('请先同意隐私协议！');
				} 
				await this.$u.wxOauth1() 
			},
			// 公众号重定向后执行
			wechatRedirect(){ 
				let code = this.getUrlCode1('code')    
				if (code == "undefined" || code == null || code == "") { 
					// this.$u.wxOauth1() 
				}else{  
					uni.showLoading({
						title:'加载中'
					})
					uni.setStorageSync('wxcode',code) 
					wechatLogin({code:code,source:'WeChat'}).then((res) => { 
						if(res.code == '200'){ 
							uni.hideLoading()
							this.$store.commit('SET_OPENID', res.result.openId)
							uni.setStorageSync('OPENID',res.result.openId);  
							if(!res.result.token){
								return uni.redirectTo({
									url:'/pages/login/phoneLogin'
								}) 
							} 
							if(res.result.token!=''){   
								uni.switchTab({ 
									url:'/pages/index/index'
								})  
								uni.setStorageSync('TOKEN',res.result.token);
								this.$store.commit('SET_TOKEN', res.result.token) 
							} 
						}else{ 
							uni.hideLoading() 
							uni.showToast({
								title:res.message,
								icon:'none'
							})
							//#ifdef H5   
								setTimeout(function(){
									// window.location.href= 'http://www.spadj.com/#/pages/login/index'   //退出登录重定向
									// window.location.href=`${process.env.UNI_BASE_URL}/user/#/pages/login/index`
									window.location.href=`${process.env.UNI_BASE_URL}/user/pages/login/index`
								},1000) 
							//#endif 
						}
						// uni.setStorageSync('OPENID',res.result); 
						// console.log(res,'公众号-获取openId',uni.getStorageSync('OPENID')); 
						// this.$store.commit("SET_OPENID", res.result);  
					}).catch((err) => {}); 
				}
			},
			stringIsEmpty(obj){
				if(typeof obj == "undefined" || obj == null || obj == ""){
					return true;
				}else{
					return false;
				}
			},
			
			// 用户协议
			userxy(){ 
				// uni.navigateTo({
				// 	url:'/pages/webview/policyUser'
				// })
				const info = config.appInfo.agreements[1]
				uni.navigateTo({
					url:'/pages/webview/content?info='+ encodeURIComponent(JSON.stringify(info))
				}) 
			}, 
			// 隐私政策
			privacy(){
				// uni.navigateTo({  
				// 	url:'/pages/webview/policy'
				// })
				const info = config.appInfo.agreements[0]
				uni.navigateTo({
					url:'/pages/webview/content?info='+ encodeURIComponent(JSON.stringify(info))
				}) 
			},
			gophone(){
				uni.navigateTo({
					url:'/pages/login/phoneLogin'
				})
			}, 
			goBack(){
				uni.navigateBack( ) 
			}, 
			escLogin(){
				uni.switchTab({
					url:'/pages/index/index'
				})
			},
		}
	}
</script>

<style  lang="scss"> 
	.content { 
		width: 100vw;
		height: 100vh;
		// background: url('https://test.spadj.com/policy/logo_bg.png')  no-repeat center center fixed ; 
		background-size: 100% auto;
		box-sizing: border-box; 
		.login_bg{
			position: absolute;
			width: 100%; 
			height: 100%;
			top: 0;
			z-index: -1;
		}
		.login_con{
			width: 674rpx;
			margin: 0 auto; 
		}
		.other_login{
			position: fixed;
			bottom: 100rpx;
			width:600rpx ;
			margin: 0 75rpx;
			font-size: 28rpx;
			color: #fff; 
			.other_tit{
				margin-bottom: 36rpx;
			}
			.tel_icon{
				width:80rpx ;
				height: 80rpx;
				margin-bottom: 10rpx;
				background-color: #fff;
				border-radius: 50%;
				opacity: 0.6;
				text-align: center;
				line-height: 80rpx;
				image{
					width: 36rpx;
					height: 54rpx;
					margin: 13rpx 0;
				}
			}
		}
	}
	.navbar{
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		width: 690rpx;
		text-align: center;
		font-size: 40rpx;
		color: #fff;
		.left{ 
			height: 40rpx; 
			margin: 32rpx 32rpx 32rpx 0; 
			font-size: 22rpx; 
		}  
	}
	.logo { 
		width: 208rpx;
		height: 196rpx !important; 
		margin: 0 233rpx;
		margin-top: 150rpx; 
		margin-bottom: 94rpx; 
		
	} 
	.loginbtn{
		width: 600rpx;
		height: 90rpx;  
		margin: 0 auto;
		margin-bottom: 24rpx;
		background: #fff;
		border-radius: 45rpx;
		font-size: 30rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 600;
		color: #2F1500;
		line-height: 90rpx;
		border: none;
		opacity: 0.6;
		.wx_icon{
			width: 44rpx;
			height: 36rpx;
			margin-right: 20rpx;
		}
	}
	.lbtn{ 
		background: none;
		color: #fff;
		border: 3rpx solid #FFFFFF;
	}
	.tips{ 
		display: flex;
		justify-content: center;
		align-items: center;
		// width: 100%; 
		margin: 0 auto;
		margin-top: 18rpx;
		font-size: 26rpx;  
		color: #fff;
		.pro{
			color:#FEBF00;
		}
		
	} 
</style>
